<section class="content-header">
  <h1>
    权限管理
    <small>权限相关操作</small>
  </h1>
  <ol class="breadcrumb">
    <li><a href="#/index"><i class="fa fa-dashboard"></i> 主页</a></li>
    <li class="active">权限管理</li>
  </ol>
</section>
<section class="content">
  <div class="row">
    <div class="col-xs-12">
      <div class="box">
        <div class="box-header">
          <h3 class="box-title">角色列表</h3>
          <hr>
          <div class="row">
            <div class="col-xs col-md-6">
              <div class="col-xs col-sm-4">
                <button privilege="添加角色" class="btn btn-primary" ng-click="addRole();">
                  <span>添加角色</span>
                </button>
              </div>
            </div>
            <div class="col-xs col-md-6">
              <div class="col-xs col-sm-4"></div>
              <div class="col-xs col-sm-6">
                <i class="fa fa-search"></i> <input type="text"
                                                    ng-change="changeCD();" ng-model="condition"
                                                    placeholder="名称/权值/描述搜索">
              </div>
            </div>
          </div>
        </div>
        <!-- /.box-header -->
        <div class="box-body">
          <table id="example2" class="table table-bordered table-hover">
            <thead>
            <tr>
              <th>角色ID</th>
              <th>角色名称</th>
              <th>角色权值</th>
              <th>描述</th>
              <th ng-show="opt">操作</th>
            </tr>
            </thead>
            <tbody>
            <tr ng-repeat="role in page.recordList">
              <td ng-bind-html="role.rid|highlightText:condition"></td>
              <td ng-bind-html="role.rname|highlightText:condition"></td>
              <td ng-bind-html="role.weight|highlightText:condition"></td>
              <td ng-bind-html="role.description|highlightText:condition"></td>
              <td>
                <button privilege="删除角色" ng-click="del(role.rid)" class="btn-xs btn-danger">
                  <span>删除</span>
                </button>
                <button privilege="修改角色" ng-click="edit($index)" class="btn-xs btn-info">
                  <span>修改</span>
                </button>
                <button privilege="设置角色权限" ng-click="setPrivilege(role.rid)" class="btn-xs btn-warning">
                  <span>设置权限</span>
                </button>
              </td>
            </tr>
            </tbody>
          </table>
          <div ui-view="pagebar"></div>
        </div>
        <!-- /.box-body -->
      </div>
    </div>
  </div>
</section>
<div class="modal fade" role="dialog" id="role"
     aria-labelledby="title">
  <form name="myForm" novalidate id="form">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" ng-click="cancel();"
                  aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title" ng-model="title">{{title}}</h4>
        </div>
        <div class="modal-body">
          <div class="container-fluid">
            <div class="row">
              <div class="col-xs col-md-6">
                <div class="input-group">
										<span class="input-group-addon">
                                            <i class="fa fa-user"></i>
                                        </span>
                  <input ng-model="role.rname"
                         type="text" name="rname"
                         class="form-control"
                         aria-describedby="sizing-addon1"
                         placeholder="角色名称" required>
                </div>
                                <span style="color:red"
                                      ng-show="myForm.rname.$dirty && myForm.rname.$invalid">
                                    <span ng-show="myForm.rname.$error.required">角色名称必须填写。</span>
                                </span>
              </div>
              <div class="col-xs col-md-6">
                <div class="input-group">
                                     <span class="input-group-addon">
                                            <i class="fa fa-database"></i>
                                        </span>
                  <input ng-model="role.weight"
                         type="number"
                         name="weight"
                         class="form-control"
                         aria-describedby="sizing-addon1"
                         placeholder="权值"
                         required>
                </div>
                <span style="color:red"
                      ng-show="myForm.weight.$dirty && myForm.weight.$invalid">
                                    <span ng-show="myForm.weight.$error.required">权值必须填写。</span>
                                </span>
              </div>
            </div>
            <br/>
            <div class="row">
              <div class="col-xs col-md-12">
                <div class="input-group">
                                   <span class="input-group-addon">
                                            <i class="fa fa-info-circle"></i>
                                        </span>
                  <textarea ng-model="role.description"
                            name="description"
                            ng-min="role.description"
                            class="textarea"
                            style="width: 100%;  font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;"
                            aria-describedby="sizing-addon1"
                            placeholder="角色描述"
                            required></textarea>
                </div>
              </div>
            </div>
            <br/>
            <div class="modal-footer">
              <button type="button" class="btn btn-default"
                      ng-click="cancel();">取消
              </button>
              <button type="button" class="btn btn-primary" ng-click="save();"
                      ng-disabled="!myForm.$valid">
                保存
              </button>
            </div>
          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div>
      <!-- /.modal -->
    </div>
  </form>
</div>
<div class="modal fade" role="dialog" id="privilege"
     aria-labelledby="title">
  <form name="myForm1" novalidate id="form1">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" ng-click="cancel(1);"
                  aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">设置权限</h4>
        </div>
        <div class="modal-body">
          <div class="container-fluid">
            <div>
              <ul id="tree" class="ztree" style="width:560px; overflow:auto;"></ul>
            </div>
            <br/>
            <div class="modal-footer">
              <button type="button" class="btn btn-default"
                      ng-click="cancel(1);">取消
              </button>
              <button type="button" class="btn btn-primary" ng-click="save(1);">
                保存
              </button>
            </div>
          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div>
      <!-- /.modal -->
    </div>
  </form>
</div>
